@extends('admin.app')
@section('content')
    <link rel="stylesheet" href="/css/icon/iconfont-0130.css">
    <link rel="stylesheet" href="/addons/icheck-1.x/skins/square/green.css">
    <link rel="stylesheet" href="/css/admin/mobileSelect.css">
    @if($skinid == 3)
        <link rel="stylesheet" href="{{assethelp('/css/admin/performance-setting.css?v='.time())}}">
    @elseif($skinid == 1)
        <link rel="stylesheet" href="/css/theme-blue/admin/performance-setting.css?v=2019052101">
    @elseif($skinid == 2)
        <link rel="stylesheet" href="/css/theme-pink/system/iconfont-pink.css">
        <link rel="stylesheet" href="/css/theme-pink/admin/performance-setting.css?v=2019052801">
    @endif
    <script src="/addons/icheck-1.x/icheck.min.js"></script>
    <div class="mian-container">
        <div class="performance-setting">
            <div class="weui-cells choose-time">
                <a class="weui-cell weui-cell_access" href="/admin/tips">
                    <div class="weui-cell__hd">
                        <img src="/img/title.png" style="width:22px;">
                    </div>

                        <div class="weui-cell__bd">
                            <p>管理标签</p>
                        </div>

                    <div class="weui-cell__ft">
                    </div>
                </a>
                <div class="weui-cell">
                    <div class="weui-cell__hd">
                        <p><i class="icon iconfont icon-kaoqin"></i>选择时间</p>
                    </div>
                    <div class="weui-cell__bd">
                        <div id="trigger3">{{$year}}-{{$month}}</div>
                    </div>
                </div>
            </div>

            <div class="center-list">
                @foreach($tongxunlu as $t)
                    <div class="section-list">
                        <h3 class="h3-title">
                            @if($t['group_name'] != '我的同事')
                                <img class="con-img" src="{{asset('/img/list-user1.png')}}">
                            @endif{{$t['group_name']}}
                        </h3>

                        <span class="num-span"></span>
                        <ul>
                            @foreach($t['member'] as $m)
                                <li>

                                    <img class="sec-img" src="{{userlogo($m['id'])}}">
                                    <span class="sec-name">{{$m['qw_name']}}</span>
                                    @foreach($m->role as $mr)
                                        <span  class="circle-span @if($mr==9) span-total @elseif($mr==10) span-exam @elseif($mr==11) span-score @elseif($mr==12) span-reward @endif">{{$roleArray[$mr]}}</span>
                                    @endforeach
                                    @if($m['is_sales'] == 1)
                                    <span class="circle-span span-sell">销</span>
                                    @endif

                                    <div class="hidden-div" style="font-family:'黑体'">
                                        <div class="weui-flex">
                                            <div class="weui-flex__item create-item">
                                                <i class="icon iconfont icon-addition"></i>创建项目
                                            </div>
                                        </div>
                                        <input type="hidden" value="{{$m->id}}" class="user_id">
                                        @foreach($m->achievement as $value2)
                                            <div class="childern-div" data-id="{{$value2->id}}">
                                                <div class="pt-div">
                                                    <p class="project-p name">{{$value2->name}}</p>
                                                    <p class="title-na" ><span></span>{{!empty($value2->tip) && $value2->tip->name?$value2->tip->name:"无"}}</p>
                                                </div>
                                                <div class="standard-p">
                                                    <p>目标值</p>
                                                    <input type="tel" class="standard" value="{{$value2->standard}}">
                                                </div>
                                                <div class="standard-p">
                                                    <p>完成值</p>
                                                    <input type="tel" class="score" value="{{$value2->score}}" class="score">
                                                </div>
                                                <div class="button-g">
                                                    <button class="button-shanchu3">删除</button>
                                                    <button class="button-queding">确定</button>
                                                </div>
                                            </div>
                                        @endforeach
                                    </div>
                                </li>
                            @endforeach
                        </ul>
                        @if(isset($t['child']))
                            @foreach($t['child'] as $c)
                                <div class="second-list">
                                    <h3 class="h3-title">
                                        <img class="con-img" src="{{asset('/img/list-user1.png')}}">{{$c['group_name']}}
                                    </h3>
                                    <span class="num-span"></span>
                                    <ul>
                                        @foreach($c['member'] as $cm)
                                            <li>
                                                <img class="sec-img" src="{{userlogo($cm['id'])}}">
                                                <span class="sec-name">{{$cm['qw_name']}}</span>
                                                @if($cm['is_leader'] == 1)<i class="icon iconfont icon-qizi"></i>@endif
                                                @foreach($cm->role as $cmr)
                                                    <span  class="circle-span @if($cmr==9) span-total @elseif($cmr==10) span-exam @elseif($cmr==11) span-score @elseif($cmr==12) span-reward @endif">{{$roleArray[$cmr]}}</span>
                                                @endforeach
                                                @if($cm['is_sales'] == 1)
                                                    <span class="circle-span span-sell">销</span>
                                                @endif
                                                <div class="hidden-div" style="font-family:'黑体'">
                                                    <div class="weui-flex">
                                                        <div class="weui-flex__item create-item">
                                                            <i class="icon iconfont icon-addition"></i>创建项目
                                                        </div>
                                                    </div>
                                                    <input type="hidden" value="{{$cm->id}}" class="user_id">
                                                    @foreach($cm->achievement as $value2)
                                                        <div class="childern-div" data-id="{{$value2->id}}">
                                                            <div class="pt-div">
                                                                <p class="project-p name">{{$value2->name}}</p>
                                                                <p class="title-na" style="background: {{$value2->color}}"><span></span>{{!empty($value2->tip) && $value2->tip->name?$value2->tip->name:"无"}}</p>
                                                            </div>
                                                            <div class="standard-p">
                                                                <p>目标值</p>
                                                                <input type="tel" class="standard" value="{{$value2->standard}}">
                                                            </div>
                                                            <div class="standard-p">
                                                                <p>完成值</p>
                                                                <input type="tel" class="score" value="{{$value2->score}}" class="score">
                                                            </div>
                                                            <div class="button-g">
                                                                <button class="button-shanchu3">删除</button>
                                                                <button class="button-queding">确定</button>
                                                            </div>
                                                        </div>
                                                    @endforeach
                                                </div>
                                            </li>
                                        @endforeach
                                    </ul>
                                    @foreach($c['child'] as $cc)
                                        <div class="third-list">
                                            <h3 class="h3-title">
                                                <img class="con-img" src="{{asset('/img/list-user1.png')}}">{{$cc['group_name']}}
                                            </h3>
                                            <span class="num-span"></span>
                                            <ul>
                                                @foreach($cc['member'] as $ccm)
                                                    <li>

                                                        <img class="sec-img" src="{{userlogo($ccm['id'])}}">
                                                        <span class="sec-name">{{$ccm['qw_name']}}</span>
                                                        @if($ccm['is_leader'] == 1)
                                                            <i class="icon iconfont icon-qizi"></i>@endif
                                                        @foreach($ccm->role as $ccmr)
                                                            <span  class="circle-span @if($ccmr==9) span-total @elseif($ccmr==10) span-exam @elseif($ccmr==11) span-score @elseif($ccmr==12) span-reward @endif">{{$roleArray[$ccmr]}}</span>
                                                        @endforeach
                                                        @if($ccm['is_sales'] == 1)
                                                            <span class="circle-span span-sell">销</span>
                                                        @endif
                                                        <div class="hidden-div" style="font-family:'黑体'">
                                                            <div class="weui-flex">
                                                                <div class="weui-flex__item create-item">
                                                                    <i class="icon iconfont icon-addition"></i>创建项目
                                                                </div>
                                                            </div>
                                                            <input type="hidden" value="{{$ccm->id}}" class="user_id">
                                                            @foreach($ccm->achievement as $value2)
                                                                <div class="childern-div" data-id="{{$value2->id}}">
                                                                    <div class="pt-div">
                                                                        <p class="project-p name">{{$value2->name}}</p>
                                                                        <p class="title-na" style="background: {{$value2->color}}"><span></span>{{!empty($value2->tip) && $value2->tip->name?$value2->tip->name:"无"}}</p>
                                                                    </div>
                                                                    <div class="standard-p">
                                                                        <p>目标值</p>
                                                                        <input type="tel" class="standard" value="{{$value2->standard}}">
                                                                    </div>
                                                                    <div class="standard-p">
                                                                        <p>完成值</p>
                                                                        <input type="tel" class="score" value="{{$value2->score}}" class="score">
                                                                    </div>
                                                                    <div class="button-g">
                                                                        <button class="button-shanchu3">删除</button>
                                                                        <button class="button-queding">确定</button>
                                                                    </div>
                                                                </div>
                                                            @endforeach
                                                        </div>
                                                    </li>
                                                @endforeach
                                            </ul>
                                        </div>
                                    @endforeach
                                </div>
                            @endforeach
                        @endif
                    </div>
                @endforeach

            </div>
        </div>

        @if($user->getRole()==9)
            @include('sysadmin.admin-caidan')
        @else
            <div class="reful-tabbar">
                <a href="{{url('/user/performance/perf')}}" class="tabbar-item">
                    <p style="line-height: 65px;" class="tabbar-label">返回个人用户界面</p>
                </a>
            </div>

        @endif
    </div>

    <div class="shadow-hidden"></div>
    <div class="hidden-sec">
        <div class="popup"><h3>创建项目</h3><i class="weui-icon-cancel"></i></div>
        <p>请为新项目输入名称</p>
        <input type="text" value="" name="pro-name" class="input text-input">
        <p>选择所属标签</p>
        <select class="title-name input">
            <option value="0">无</option>
            @foreach( $tips as $k =>$v)
            <option value="{{$v->id}}">{{$v->name}}</option>
            @endforeach
        </select>
        <a class="sub-mit modi-nickname" href="javascript:void(0);">保存</a>
    </div>
    <div class="fix-message">
        @if($skinid == 3)
            <img src="/img-theme-pink/que-3.png">
        @elseif($skinid == 1)
            <img src="/img-theme-pink/que-2.png">
        @elseif($skinid == 2)
            <img src="/img-theme-pink/que-1.png">
        @endif
    </div>
    <script src="/js/mobileSelect.js"></script>
    <script>
        $(document).ready(function () {
            $('.fix-message img').click(function () {
                $.alert("本系统以创建项目，填写完成值的方式来表现员工的绩效值。为方便统计和类比，对于明确的，需要多次填写的考核项目，可创建低于6个字的标签，填写时选择标签类别再填写；其它类别的考核项目，可直接创建项目进行填写。", "提示");
            })

            var time = '{{$start}}';
            var UplinkData = [
                {
                    id: '2017',
                    value: '2017年',
                    childs: [
                        {id: '1', value: '1月'},
                        {id: '2', value: '2月'},
                        {id: '3', value: '3月'},
                        {id: '4', value: '4月'},
                        {id: '5', value: '5月'},
                        {id: '6', value: '6月'},
                        {id: '7', value: '7月'},
                        {id: '8', value: '8月'},
                        {id: '9', value: '9月'},
                        {id: '10', value: '10月'},
                        {id: '11', value: '11月'},
                        {id: '12', value: '12月'}
                    ]
                },
                {
                    id: '2018',
                    value: '2018年',
                    childs: [
                        {id: '1', value: '1月'},
                        {id: '2', value: '2月'},
                        {id: '3', value: '3月'},
                        {id: '4', value: '4月'},
                        {id: '5', value: '5月'},
                        {id: '6', value: '6月'},
                        {id: '7', value: '7月'},
                        {id: '8', value: '8月'},
                        {id: '9', value: '9月'},
                        {id: '10', value: '10月'},
                        {id: '11', value: '11月'},
                        {id: '12', value: '12月'}
                    ]
                },
                {
                    id: '2019',
                    value: '2019年',
                    childs: [
                        {id: '1', value: '1月'},
                        {id: '2', value: '2月'},
                        {id: '3', value: '3月'},
                        {id: '4', value: '4月'},
                        {id: '5', value: '5月'},
                        {id: '6', value: '6月'},
                        {id: '7', value: '7月'},
                        {id: '8', value: '8月'},
                        {id: '9', value: '9月'},
                        {id: '10', value: '10月'},
                        {id: '11', value: '11月'},
                        {id: '12', value: '12月'}
                    ]
                },
                {
                    id: '2020',
                    value: '2020年',
                    childs: [
                        {id: '1', value: '1月'},
                        {id: '2', value: '2月'},
                        {id: '3', value: '3月'},
                        {id: '4', value: '4月'},
                        {id: '5', value: '5月'},
                        {id: '6', value: '6月'},
                        {id: '7', value: '7月'},
                        {id: '8', value: '8月'},
                        {id: '9', value: '9月'},
                        {id: '10', value: '10月'},
                        {id: '11', value: '11月'},
                        {id: '12', value: '12月'}
                    ]
                },
                {
                    id: '2021',
                    value: '2021年',
                    childs: [
                        {id: '1', value: '1月'},
                        {id: '2', value: '2月'},
                        {id: '3', value: '3月'},
                        {id: '4', value: '4月'},
                        {id: '5', value: '5月'},
                        {id: '6', value: '6月'},
                        {id: '7', value: '7月'},
                        {id: '8', value: '8月'},
                        {id: '9', value: '9月'},
                        {id: '10', value: '10月'},
                        {id: '11', value: '11月'},
                        {id: '12', value: '12月'}
                    ]
                },
                {
                    id: '2022',
                    value: '2022年',
                    childs: [
                        {id: '1', value: '1月'},
                        {id: '2', value: '2月'},
                        {id: '3', value: '3月'},
                        {id: '4', value: '4月'},
                        {id: '5', value: '5月'},
                        {id: '6', value: '6月'},
                        {id: '7', value: '7月'},
                        {id: '8', value: '8月'},
                        {id: '9', value: '9月'},
                        {id: '10', value: '10月'},
                        {id: '11', value: '11月'},
                        {id: '12', value: '12月'}
                    ]
                },
                {
                    id: '2023',
                    value: '2023年',
                    childs: [
                        {id: '1', value: '1月'},
                        {id: '2', value: '2月'},
                        {id: '3', value: '3月'},
                        {id: '4', value: '4月'},
                        {id: '5', value: '5月'},
                        {id: '6', value: '6月'},
                        {id: '7', value: '7月'},
                        {id: '8', value: '8月'},
                        {id: '9', value: '9月'},
                        {id: '10', value: '10月'},
                        {id: '11', value: '11月'},
                        {id: '12', value: '12月'}
                    ]
                },
                {
                    id: '2024',
                    value: '2024年',
                    childs: [
                        {id: '1', value: '1月'},
                        {id: '2', value: '2月'},
                        {id: '3', value: '3月'},
                        {id: '4', value: '4月'},
                        {id: '5', value: '5月'},
                        {id: '6', value: '6月'},
                        {id: '7', value: '7月'},
                        {id: '8', value: '8月'},
                        {id: '9', value: '9月'},
                        {id: '10', value: '10月'},
                        {id: '11', value: '11月'},
                        {id: '12', value: '12月'}
                    ]
                },
                {
                    id: '2025',
                    value: '2025年',
                    childs: [
                        {id: '1', value: '1月'},
                        {id: '2', value: '2月'},
                        {id: '3', value: '3月'},
                        {id: '4', value: '4月'},
                        {id: '5', value: '5月'},
                        {id: '6', value: '6月'},
                        {id: '7', value: '7月'},
                        {id: '8', value: '8月'},
                        {id: '9', value: '9月'},
                        {id: '10', value: '10月'},
                        {id: '11', value: '11月'},
                        {id: '12', value: '12月'}
                    ]
                },
            ]
            var mobileSelect3 = new MobileSelect({
                trigger: '#trigger3',
                title: '选择时间',
                wheels: [
                    {data: UplinkData}
                ],
                //     keyMap: {
                //        id:'id',
                //        value: 'name',
                //        childs :'son'
                //      },
                position: [0, 1],
                callback: function (indexArr, data) {
                    //
                    var year = data[0].id;
                    var month = data[1].id;

                    window.location.href = '/admin/achievement?caidan=1&year=' + year + '&month=' + month;
                    console.log(data[1].id); //返回选中的json数据
                }
            });

            $('body').on('focus', '.score', function () {
                $(this).parent().next('.sure').toggleClass('sure');
            });


            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });
            $('input').iCheck({
                labelHover: false,
                cursor: true,
                checkboxClass: 'icheckbox_square-blue',  // 注意square和blue的对应关系
                radioClass: 'iradio_square-blue',
                increaseArea: '20%' // optional
            });
            $('.num-span').each(function () {
                $(this).text($(this).next('ul').children().length);
            });
            $('.h3-title').click(function () {
                $(this).toggleClass('ah3-title');
                $(this).siblings('ul').toggle();
            });
            $('.h3-title').click();
            $('.kaohe-item').click(function () {
                $('.show-hidden').toggle();
            });
            $('.admin-item').click(function () {
                $('.front-show-hidden').toggle();
            });
            $('.delete-item').click(function () {
                $(this).parent().siblings().find('.icon-shanchu3').toggle();
            })

            $('.sec-name').click(function () {
                $(this).toggleClass('sec-after');
                $(this).siblings('.hidden-div').toggle();

            })
            //删除，ajax
            $('body').on('click', '.button-shanchu3', function () {
                var that = this;
                $.confirm({
                    title: '删除',
                    text: '删除该项目和项目下分值',
                    onOK: function () {     //删除
                        //ajax
                        var dataId = $(that).parent().parent().attr('data-id');
                        if (dataId) {
                            ajax_achievement_delete($(that).parent().parent().attr('data-id'));
                            $(that).parent().parent().remove();
                            //  $(that).parent().parent().siblings().find('.icon-shanchu3').toggle();
                        } else {
                            $(that).parent().parent().remove();
                        }

                    },
                    onCancel: function () {


                    }
                });
            })
            // 添加,ajax
            $('.create-item').click(function () {
                //$('.text-input').val('');
                $('.shadow-hidden').css('display', 'block');
                $('.hidden-sec').css('display', 'block');
                var that = this;
                $('.sub-mit').off('click').on('click', function (e) {
                    if ($('.text-input').val() == '') {
                        $.toast("请填写项目名！", "forbidden");
                    } else if ($('.text-input').val().length > 24) {
                        $.alert("项目名请在24字以内！");
                    } else {
                        console.log($('.title-name' ).val() );
                        $(that).parent().parent().append('<div class="childern-div" data-id="">'
                                + '<div class="pt-div">'
                                + '<p class="project-p name">' + $('.text-input').val() + '</p>'
                                + '<p class="title-na"  id='+$(".title-name").val()+' ><span ></span>' + $('.title-name option:selected' ).text() + '</p>'
                                + '</div>'
                                + '<div class="standard-p">'
                                + '<p>目标值</p>'
                                + '<input type="tel"  class="standard" value="100">'
                                + '</div>'
                                + '<div class="standard-p" >'
                                + '<p>完成值</p>'
                                + '<input type="tel" class="score"  class="score" value="0">'
                                + '</div>'
                                + '<div class="button-g">'
                                + '<button class="button-shanchu3">删除</button>'
                                + '<button class="button-queding">确定</button>'
                                + '</div>'
                                + '</div>');
                        $('.hidden-sec').css('display', 'none');
                        $('.shadow-hidden').css('display', 'none');
                        e.stopPropagation();
                    }
                })
            })

            //确定，提交信息取input信息，ajax
            $('body').on('click', '.button-queding', function () {
                $(this).parent();
                var name = $(this).parent().parent().find('.name').html();
                var standard = $(this).parent().parent().find('.standard').val();
                var score = $(this).parent().parent().find('.score').val();
                var id = $(this).parent().parent().attr('data-id');
                var user_id = $(this).parent().parent().parent().find(".user_id").val();
                var tip = $(this).parent().parent().find(".title-na").attr("id");

                if (id) {
                    ajax_achievement_update(score, standard, user_id, id, $(this).parent().parent())
                } else {
                    ajax_achievement_create(name, standard, score, user_id, $(this).parent().parent(),tip);
                }
            });
            $('.hidden-sec .popup i').click(function () {
                $('.hidden-sec').css('display', 'none');
                $('.shadow-hidden').css('display', 'none');
            })
            function ajax_achievement_create(name, standard, score, user_id, dom,tip) {
                var url = '/admin/achievement';
                $.ajax({
                    type: 'post',
                    cache: 'false',
                    url: url,
                    data: 'name=' + name + '&standard=' + standard + '&score=' + score + '&user_id=' + user_id + '&time=' + time + '&tip=' + tip,
                    dataType: 'json',
                    success: function (data) {
                        if (data.status == 'success') {
                            $.toptip(data.msg, 'success');
                            console.log(dom);
                            dom.attr('data-id', data.data.id);
                            dom.find('i').toggleClass('sure');
                            setTimeout(function () {
                                dom.find('i').removeClass("sure");
                            }, 3000);
                        } else {
                            $.toptip(data.msg, 'error');
                            setTimeout(function () {
                                //window.location.href = data.redirectUrl;
                            }, 1000);
                        }
                    },
                    error: function () {
                        $.toptip('网络异常请重试', 'warning');
                    }
                });
            }

            function ajax_achievement_update(score,standard, user_id, id, dom) {
                var url = '/admin/achievement/' + id;
                $.ajax({
                    type: 'put',
                    cache: 'false',
                    url: url,
                    data: 'id=' + id + '&score=' + score + '&user_id=' + user_id + '&standard=' + standard,
                    dataType: 'json',
                    success: function (data) {
                        if (data.status == 'success') {
                            $.toptip(data.msg, 'success');
                            dom.find('i').toggleClass('sure');
                            setTimeout(function () {
                                dom.find('i').removeClass("sure");
                            }, 3000);
                        } else {
                            $.toptip(data.msg, 'error');
                            setTimeout(function () {
                                //window.location.href = data.redirectUrl;
                            }, 1000);
//                            window.location.href= data.redirectUrl;
                        }
                    },
                    error: function () {
                        $.toptip('网络异常请重试', 'warning');
                    }
                });
            }

            function ajax_achievement_delete(id) {
                var url = '/admin/achievement/' + id;
                $.ajax({
                    type: 'delete',
                    cache: 'false',
                    url: url,
                    dataType: 'json',
                    success: function (data) {
                        if (data.status == 'success') {
                            $.toptip(data.msg, 'success');
                        } else {
                            $.toptip(data.msg, 'error');
                            setTimeout(function () {
                                window.location.href = data.redirectUrl;
                            }, 1000);
//                            window.location.href= data.redirectUrl;
                        }
                    },
                    error: function () {
                        $.toptip('网络异常请重试', 'warning');
                    }
                });
            }
        })
    </script>
@endsection
